.warp-content {
  width: $warp-width;
  margin: auto;
}

.el-header {
  background-color: $header-color;
  color: #fff;
  text-align: center;
  line-height: 60px;
}

.el-footer {
  background-color: $footer-color;
  text-align: center;
  line-height: 50px;
}

// 响应式适配

@media screen and (max-width: 960px) {
  .el-aside {
    display: none;
  }

  .warp-content {
    width: 100%;
  }
}

@media screen and (min-width: 960px) {
  .el-aside {
    display: block;
  }
}

@media screen and (max-width: 576px) {
  .warp-content {
    .el-main {
      padding: 0 5px;
    }
  }
}
